﻿<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>简易计算器</title>

</head>

<body>
 <form action="" method="post"  id="myform" name="myform">
<table border="0" >
  <tr>
    <td><img src="images/logo.png" width="54" height="54"></td>
<td colspan="3"><h3>简易计算器</h3></td>
  </tr>
  <tr>
    <td>第一个数</td>
    <td colspan="3"><input name="txtNum1" type="text"  id="txtNum1" size="25"/></td>
  </tr>
  <tr>
    <td>第二个数</td>
    <td colspan="3"><input name="txtNum2" type="text"  id="txtNum2" size="25"/></td>
  </tr>
  <tr>
    <td><input name="addButton2" type="button" id="addBtn" value="  ＋  "  onclick="compute('+')"></td>
    <td><input name="subButton2" type="button" id="subBtn" value="  －  "  onclick="compute('-')"/></td>
    <td><input name="mulButton2" type="button" id="mulBtn" value="  ×  "  onclick="compute('*')"/></td>
    <td><input name="divButton2" type="button" id="divBtn" value="  ÷  "  onclick="compute('/')"/></td>
  </tr>
  <tr>
    <td>计算结果</td>
    <td colspan="3"><input name="txtresult" type="text"  id="txtResult" size="25"/></td>
  </tr>
</table>
</form>

<script>
    //加减乘除一体函数
    function compute(operator){
      //1.获取值
      var num1 = Number(document.myform.txtNum1.value);
      var num2 = Number(document.myform.txtNum2.value);
      var result ;
      //2.针对输入的值进行合法判断
      if( isNaN(num1) || isNaN(num2)){
        alert('请输入合法的数字！')
      }else{
         //3.根据参数进行对应的运算
         switch(operator){
          case '+':
            result = num1 + num2;
            break;
          case '-':
            result = num1 - num2;
            break;
            case '*':
            result = num1 * num2;
            break;
          case '/':
            if(num2 != 0){
              result = num1 / num2;
            }else{
              alert('除数不能为0！');
            }
            break;
         }
         //将结果给文本3
       document.myform.txtResult.value = result;
      }
    }
</script>
</script>
</body>
</html>
